<template>
  <div class="home-page">
    <h1>仪表盘</h1>
    <div class="dashboard">
      <div class="stats-grid">
        <div class="stat-card">
          <h3>总用户数</h3>
          <p class="value">1,234</p>
        </div>
        <div class="stat-card">
          <h3>今日活跃</h3>
          <p class="value">567</p>
        </div>
        <div class="stat-card">
          <h3>新增用户</h3>
          <p class="value">89</p>
        </div>
        <div class="stat-card">
          <h3>总用户数2</h3>
          <p class="value">1,234</p>
        </div>
        <div class="stat-card">
          <h3>今日活跃2</h3>
          <p class="value">567</p>
        </div>
        <div class="stat-card">
          <h3>新增用户2</h3>
          <p class="value">89</p>
        </div>
      </div>
    </div>
    <div class="quick-actions">
      <!-- 快捷操作按钮 -->
    </div>
    <div class="recent-activities">
      <!-- 最近活动列表 -->
    </div>
  </div>
</template>

<script setup lang="ts">
// 首页特有的逻辑和数据
</script>

<style scoped>
.home-page {
  /*  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;*/
  background-color: white; /* 背景色*/
  border-radius: 10px; /* 圆角*/
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 阴影*/
  height: 100%;
  width: 100%;
}
</style>
